<template>
  <custom-dialog v-model="showDialog" :title="props.title" @closed="handleCancel">
    <el-alert v-if="props.eventParam" type="info" :closable="false" :title="'form.' + props.eventParam"></el-alert>
    <EditorComponent :mode="props.mode" :readonly="props.readonly" v-model="value"></EditorComponent>
    <el-alert v-if="props.eventParam" type="info" :closable="false" title="}"></el-alert>
    <template #footer>
      <slot name="footer"></slot>
    </template>
  </custom-dialog>
</template>
<script setup lang="ts">
import CustomDialog from '../common/custom-dialog/index.vue'
import EditorComponent from './editor.vue'

defineOptions({
  name: 'CodeEditor',
})
type Props = {
  mode: string
  readonly: boolean
  title?: string
  eventParam?: string
}
const props = withDefaults(defineProps<Props>(), {
  mode: 'javascript',
  readonly: false,
  title: '编辑代码',
  eventParam: '',
})
const showDialog = defineModel('show', { default: false })
const value = defineModel<string>()
const editorRef = ref(null)
// 取消按钮处理
const handleCancel = () => {
  showDialog.value = false
}

</script>
<style></style>
